/**
 * 路由配置文件
 * 定义应用程序的路由规则和导航守卫
 */

import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '../store'
import Login from '../views/Login.vue'
import Layout from '../views/Layout.vue'

// 使用VueRouter插件
Vue.use(VueRouter)

// 创建路由实例
const router = new VueRouter({
  mode: 'history', // 使用HTML5 History模式
  base: process.env.BASE_URL, // 应用的基础URL
  routes: [
    // 登录页面路由
    {
      path: '/login',
      name: 'Login',
      component: Login,
      meta: { requiresAuth: false } // 不需要认证
    },
    // 主布局路由
    {
      path: '/',
      component: Layout,
      meta: { requiresAuth: true }, // 需要认证
      children: [
        // 默认重定向到仪表盘
        {
          path: '',
          redirect: '/dashboard'
        },
        // 仪表盘页面
        {
          path: 'dashboard',
          name: 'Dashboard',
          component: () => import('@/views/Dashboard.vue'),
          meta: { requiresAuth: true }
        },
        // 员工管理页面 - 需要admin或manager权限
        {
          path: 'employee',
          name: 'Employee',
          component: () => import('@/views/employee/EmployeeList.vue'),
          meta: { requiresAuth: true, role: ['admin', 'manager'] }
        },
        // 部门管理页面 - 仅admin权限
        {
          path: 'department',
          name: 'Department',
          component: () => import('@/views/department/DepartmentList.vue'),
          meta: { requiresAuth: true, role: ['admin'] }
        },
        // 职位管理页面 - 仅admin权限
        {
          path: 'position',
          name: 'Position',
          component: () => import('@/views/position/PositionList.vue'),
          meta: { requiresAuth: true, role: ['admin'] }
        },
        // 薪资管理页面 - 需要admin或manager权限
        {
          path: 'salary',
          name: 'Salary',
          component: () => import('@/views/salary/SalaryList.vue'),
          meta: { requiresAuth: true, role: ['admin', 'manager'] }
        },
        // 出差管理页面 - 需要认证
        {
          path: 'business-trip',
          name: 'BusinessTrip',
          component: () => import('@/views/business-trip/BusinessTripList.vue'),
          meta: { requiresAuth: true }
        },
        // 公告管理页面 - 仅admin权限
        {
          path: 'announcement',
          name: 'Announcement',
          component: () => import('@/views/announcement/AnnouncementList.vue'),
          meta: { requiresAuth: true, role: ['admin'] }
        },
        // 用户详情页面 - 需要认证
        {
          path: 'user/:id',
          name: 'UserDetail',
          component: () => import('@/views/employee/UserDetail.vue'),
          props: true,
          meta: { requiresAuth: true }
        }
      ]
    },
    // 404重定向到仪表盘
    {
      path: '*',
      redirect: '/dashboard'
    }
  ]
})

/**
 * 全局路由守卫
 * 处理路由权限和认证
 */
router.beforeEach((to, from, next) => {
  const isAuthenticated = store.getters['user/isAuthenticated'] // 获取认证状态
  const userRole = store.state.user.role // 获取用户角色

  // 已登录用户访问登录页时重定向到首页
  if (to.path === '/login' && isAuthenticated) {
    next('/');
    return;
  }

  // 检查路由是否需要认证
  if (to.matched.some(record => record.meta.requiresAuth)) {
    // 未登录用户重定向到登录页
    if (!isAuthenticated) {
      next({
        path: '/login',
        query: { redirect: to.fullPath } // 保存原始目标路径
      });
      return;
    }
    // 检查用户权限
    if (to.meta.role && !to.meta.role.includes(userRole)) {
      next('/dashboard'); // 权限不足时重定向到仪表盘
      return;
    }
  }
  
  // 确保路由切换时DOM已更新
  next();
})

export default router